﻿<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
	<title>NetGraph Demo Page</title>
	<link rel="stylesheet" type="text/css" href="styles.css"/>
	<script type="text/javascript" src="lib/html.js"></script>
	<script type="text/javascript" src="lib/jquery-1.11.1.min.js"></script>
	<script type="text/javascript" src="lib/raphael-min.js"></script>
	<script type="text/javascript" src="netgraph.js"></script>
	<script type="text/javascript">
		var words = "javascript actionscript vbscript ecmascript table sheet variable direction inspection, assumption integration ecma integral vegetable".split(" ");
		
		
		var grNodes = {};
		(function(){
			for(var i=0,w; w=words[i],i<words.length; i++){
				grNodes[w] = {name:w};
			}
		})();

		
		var graph = new NetGraph(
			grNodes, // node set
			function (nodes){ // link builder function
				function distance(w1, w2){
					var res = 1;
					for(var st=0; st<(w1.length+w2.length-1); st++){
						var cnt = 0;
						for(m=0; m<w1.length; m++){
							if(w1[m]==w2[m+st]) cnt++;
						}
						if(cnt>res) res = cnt;
					}
					return Math.ceil(85/res);
				}
				function getLinks(word, idx){
					var res = [];
					for(var i=idx,w; w=words[i],i<words.length; i++){
						if(w===word) continue;
						var dist = distance(word, w);
						res.push([w, dist]);
					}
					return res;
				}
				var i=1;
				for(var w in nodes){
					var nd = nodes[w];
					nd.links = getLinks(w, i);
					i++;
				}
			}
		);
			
		graph.settings({
			nodeSize:7,
			initialDistance:80,
			displayLinks:false
		});
		$(function(){
			graph.display("out", "report");
		});
	</script>
</head>
<body>
	<h1>NetGraph Demo Page</h1>
	<div id="out" style="width:800px; height:500px;"></div>
	<div id="report" style="width:800px; height:50px;"></div>
</body>
</html>